<template>
  <f7-page>
    <div
      style="
        width: 100%;
        padding: calc(20px * var(--ratio)) calc(32px * var(--ratio));
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: #000;
      "
    >
      <div class="left">
        <f7-link back
          ><f7-icon f7="chevron_left" style="color: #000"></f7-icon
        ></f7-link>
      </div>
      <div class="title">问题反馈</div>
      <div class="right">
        <f7-link @click="save">提交</f7-link>
      </div>
    </div>

    <f7-block>
      <qm-field
        label="问题和意见"
        placeholder="请详细描述你的问题和意见"
        type="textarea"
        autosize
        clearable
        required
        v-model="models.model.problem"
      >
      </qm-field>

      <qm-field
        label="联系方式"
        placeholder="选填，方便我们联系你"
        type="text"
        autosize
        clearable
        v-model="models.model.telephone"
      >
      </qm-field>
    </f7-block>

    <!-- <f7-navbar>
            <f7-nav-left>
                <f7-link back icon-material="arrow_back"></f7-link>
            </f7-nav-left>
            <f7-nav-title>问题反馈</f7-nav-title>
            <f7-nav-right>
                <f7-link @click="save">提交</f7-link>
            </f7-nav-right>
        </f7-navbar> -->
    <!-- <f7-block-title>问题和意见</f7-block-title>
        <f7-list>
            <f7-list-item>
                <f7-input type="textarea" resizable clear-button :value="models.model.problem" @input="models.model.problem = event.target.value" placeholder="请详细描述你的问题和意见" validate required></f7-input>
            </f7-list-item>
        </f7-list>
        <f7-block-title>QQ/邮箱/手机</f7-block-title>
        <f7-list>
            <f7-list-item>
                <f7-input type="text" resizable clear-button :value="models.model.telephone" @input="models.model.telephone = event.target.value" placeholder="选填，方便我们联系你"></f7-input>
            </f7-list-item>
        </f7-list> -->
  </f7-page>
</template>
<script>
import controller from "../../libs/framework/controller";

export default class instance extends controller {
  onBeforeInit() {
    this.urls.save = "/mobile/MobileFeedback/save";
  }
  onBuildContext() {
    this.context.models.model = {
      problem: null,
      telephone: null,
    };
    this.context.pageAction = "create";
  }
  onBeforeSave(postModel) {
    if (window.plus) {
      postModel.model.model = window.plus.device.model;
      postModel.model.vendor = window.plus.device.vendor;
      postModel.model.imei = window.plus.device.imei;
      postModel.model.uuid = window.plus.device.uuid;
      postModel.model.resolutionHeight =
        window.plus.screen.resolutionWidth * window.plus.screen.scale;
      postModel.model.resolutionWidth =
        window.plus.screen.resolutionHeight * window.plus.screen.scale;
      postModel.model.dpi =
        window.plus.screen.dpiX + " x " + window.plus.screen.dpiY;
      postModel.model.osName = window.plus.os.name;
      postModel.model.osVendor = window.plus.os.vendor;
      postModel.model.osVersion = window.plus.os.version;
      postModel.model.osLanguage = window.plus.os.language;
      postModel.model.networkType = window.plus.networkinfo.getCurrentType();
      postModel.model.appId =
        this.$framework.$f7.id || window.plus.runtime.appid;
      postModel.model.appName = this.$framework.config.name;
      postModel.model.appVersion = this.$framework.config.version;
      postModel.model.pictureIds = "";
      postModel.model.imsi = window.plus.device.imsi.join(",");

      window.plus.runtime.getProperty(
        window.plus.runtime.appid,
        function (wgtinfo) {
          postModel.model.appName = wgtinfo.name;
        }
      );

      for (let i = 0; i < window.plus.device.imsi.length; i++) {
        postModel.model.imsi += window.plus.device.imsi[i];
      }
    }
    return true;
  }
  onAfterSave(isSuccess, result) {
    if (isSuccess == true) {
      this.$f7.views.current.router.back({force:true})
    } else {
      this.$f7.dialog.alert(result.message);
    }
  }
}
</script>
